<template>
	<el-menu
		router
		:default-active="2"
		background-color="transparent"
		:collapse-transition="false"
	>
		<template v-for="val in menuLists">
			<el-sub-menu :index="val.path" v-if="val.children && val.children.length > 0" :key="val.path">
				<template #title>
					<SvgIcon :name="val.meta.icon" />
					<span>{{ other.setMenuI18n(val) }}</span>
				</template>
				<SubItem :chil="val.children" />
			</el-sub-menu>

			<template v-else>
				<el-menu-item :index="val.path" :key="val.path">
					<SvgIcon :name="val.meta.icon" />
					<template #title v-if="!val.meta.isLink || (val.meta.isLink && val.meta.isIframe)">
						<span>{{ other.setMenuI18n(val) }} </span>
					</template>

					<template #title v-else>
						<a class="w100" @click.prevent="onALinkClick(val)">{{ other.setMenuI18n(val) }}</a>
					</template>
				</el-menu-item>
			</template>
		</template>
	</el-menu>
</template>

<script setup lang="ts" name="defaultLeftMenu">
import type { RouteRecordRaw } from 'vue-router';

// 定义父组件传过来的值
const props = defineProps({
	// 菜单列表
	menuList: {
		type: Array<RouteRecordRaw>,
		default: () => [],
	},
});
</script>